<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>测试H5--Ajax</title>
</head>
<body>

    <div id="result"></div>
    <div id="msg"></div>

<script type="text/javascript">

    window.onload = function(){

        var xmlHttpRequest = new XMLHttpRequest();
        // H5判断使用的兼容性
        if(xmlHttpRequest.withCredentials){
            alert("比不起，你的浏览器不能使用H5Ajax");
        }else{
            xmlHttpRequest.open("post","param.jsp");
            xmlHttpRequest.onprogress = function(e){
                document.querySelector("#result").innerHTML = "正在进行数据处理，请稍后!当前进度为:" + (e.loaded/e.total);
            }
            xmlHttpRequest.onload = function(e){
                 document.querySelector("#msg").innerHTML = "操作完成，数据为:" + xmlHttpRequest.responseText;
            }
            xmlHttpRequest.setRequestHeader("content-Type", "form-url");
            xmlHttpRequest.send("name='nihao'&age='22'");


        }



    }


</script>

</body>
</html>